import React, { Component } from "react";
import {connect} from "react-redux";
import {addListed} from "./redux/action";

// 列表组件
class List extends Component {
  changbox = (index) => {
    return () => {
      this.props.addListed(index);
    };
  };
  render() {
    return (
      <>
        <h2>未完成</h2>
        <ul className="list">
          {/* 子组件直接通过this.props获取父组件传入的数据 */}
          {this.props.list.map((item) => (
            <li key={item.id}>
              <input type="checkbox" onClick={this.changbox(item.id)} />
              <span>{item.list}</span>
            </li>
          ))}
        </ul>
      </>
    );
  }
}
export default connect(state=>({list:state.list}),{
  addListed,
})(List);
